import 'package:flutter/material.dart';
import 'package:flutterdemo/pic/filter_selector.dart';

//不可变的
@immutable
class ExampleInstagramFilterSelection extends StatefulWidget {
  const ExampleInstagramFilterSelection({Key? key}) : super(key: key);

  @override
  State<ExampleInstagramFilterSelection> createState() => _ExampleInstagramFilterSelectionState();
}

class _ExampleInstagramFilterSelectionState
    extends State<ExampleInstagramFilterSelection> {

  final _filters = [
    Colors.white,
    ...List.generate(
        Colors.primaries.length,
            (index) => Colors.primaries[(index * 4) % Colors.primaries.length],
    )
  ];

  final _filterColor = ValueNotifier<Color>(Colors.white);

  void _onFilterChanged(Color value) {
    _filterColor.value = value;
  }

  @override
  Widget build(BuildContext context) {
    return Material(
      color: Colors.black,
      child: Stack(
        children: [
          Positioned.fill(
              child: _buildPhotoWithFilter(),
          ),
          Positioned(
              left: 0.0,
              right: 0.0,
              bottom: 0.0,
              child: _buildFilterSelector(),
          ),
        ],
      ),
    );
  }

  Widget _buildPhotoWithFilter() {
    return ValueListenableBuilder(
        valueListenable: _filterColor,
        builder: (context, value, child) {
          final color = value as Color;
          return Image.asset(
            'images/333.png',
            color: color.withOpacity(0.5),
            colorBlendMode: BlendMode.color,
            fit: BoxFit.cover,
          );
        },
    );
  }

  Widget _buildFilterSelector() {
    return FilterSelector(
        filters: _filters, onFilterChanged: _onFilterChanged);
  }
}
